<main class="style-container content-container rounded-xl style-article-bg flex-1">
  <div id="article" class="flex flex-wrap style-space-max sm:mt-12">
    <!--标题-->
    <div class="w-full text-center">
      <h1 class="style-title size-title-max">{{ post.title }}</h1>
      <div class="font-medium mt-2 style-des">
        <time>{{ post.date }}</time>
        {% if post.cats.@count %}
        <span class="mx-2" aria-hidden="true">·</span>
        {% /if %}
        {% for cat in post.cats %}
        <span><a href='{{ cat.url }}'>{{ cat.name }}</a></span>
        {% /for %}
      </div>
    </div>
    <!--内容-->
    <div class="style-content heti">
      {{ post.content }}
    </div>

    <!--翻页-->
    <div class="relative h-7 flex items-center w-full my-4 sm:my-12! size-title style-title-sub">
      {% if postNav.prev %}
      <a class="absolute left-0" href="{{ postNav.prev.url }}" title="上一页: {{ postNav.prev.title }}">
        <button class="cursor-pointer style-hover btn-animation">«&nbsp; {{postNav.prev.title }}</button>
      </a> {% /if %}
      {% if postNav.next %}
      <a class="absolute right-0" href="{{ postNav.next.url }}" title="下一页: {{ postNav.next.title }}">
        <button class="cursor-pointer style-hover btn-animation">{{ postNav.next.title }}&nbsp;»</button>
      </a>
      {% /if %}
    </div>
    <!--翻页 end-->
  </div>
</main>



<!-- 特色图片 
  {% if post.ext_featured_image.length %}
  <div class="f-img"><img src="{{ post.ext_featured_image }}" /></div>
  {% /if %}
  -->